<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>THECustomerInSight.com</title>
<link rel="stylesheet" type="text/css" href="CSS/home-style.css" media="screen" />
<link rel="stylesheet" href="CSS/slide.css" type="text/css" media="screen" />
<script type="text/javascript" src="JS/jquery-1.4.2.js"></script>
<script type="text/javascript" src="JS/coin-slider.min.js"></script>
<script type="text/javascript" src="JS/coin-slider.js"></script>
<script src="JS/slide.js" type="text/javascript"></script>

<link rel="stylesheet" href="CSS/coin-slider-styles.css" type="text/css" />
<script type="text/javascript">
	$(document).ready(function() {
	$('#coin-slider').coinslider({ width: 780, navigation: false, delay: 3000 });
	});
</script>

</head>

<body class="body">
<div class="header">
</div>

<div class="container">

<div class="topmenu">
<ul>
	  <li><a href="Index.html"> <span> Home </span></a></li>
		 <li> <a href="About us.html"> <span> About Us </span></a> </li>
		<li><a href="Membership-registration.html"> <span> Membership Registration </span></a></li>
		<li><a href="contactus.html"> <span> Contact Us </span></a></li>
		
  </ul>
</div>

<div class="login">
<div id="toppanel">
	<div id="panel">
		<div class="content clearfix">
			<div class="left">
				<h1>Welcome to www.theCustomerInSight.com </h1>
				<h2> Existing users can login here.! </h2>		
				<p class="grey"> If you forgot your password then kindly click <a href="Forgot password.html"> <b> "Forgot your Password?" </b> </a></p>
				
			</div>
			<div class="left">
				<!-- Login Form -->
				<form class="clearfix" action="login.php" method="post">
					<h1>Member Login</h1>
					<label class="grey" for="log">Email-Id:</label>
					<input class="field" type="text" name="log" id="log" value="" size="23" />
					<label class="grey" for="pwd">Password:</label>
					<input class="field" type="password" name="pwd" id="pwd" size="23" />
	            	<label><input name="rememberme" id="rememberme" type="checkbox" checked="checked" value="forever" /> &nbsp;Remember me</label>
        			<div class="clear"></div>
					<input type="submit" name="submit" value="Login" class="bt_login" />
					<a class="lost-pwd" href="Forgot password.html"> Forgot your password?</a>
				</form>
			</div>
			<div class="left right">	
            	<form name="login" action="tab1.php" method="POST" >
                <h1>Vendor/Admin Login</h1>
					<label class="grey" for="log">Email-Id:</label>
					<input class="field" type="text" name="username" id="log" value="" size="23" />
					<label class="grey" for="pwd">Password:</label>
					<input class="field" type="password" name="userpwd" id="pwd" size="23" />
	            	<div class="clear"></div>
					<input type="submit" name="submit" value="Login" class="bt_login" />
					

				</form>
				
			</div>
		</div>
</div> <!-- /login -->	

	<!-- The tab on top -->	
	<div class="tab">
		<ul class="login">
			<li class="left">&nbsp;</li>
			<li>Hello Guest!</li>
			<li class="sep">|</li>
			<li id="toggle">
				<a id="open" class="open" href="#">Log In Here!</a>
				<a id="close" style="display: none;" class="close" href="#">Close Panel</a>			
			</li>
			<li class="right">&nbsp;</li>
		</ul> 
        
	</div> <!-- / top -->
	
</div>
</div>
<div class="contentcontainer">

<div class="centercontainer">
<!-- <div id="fullcontainer"> -->
<div id="topcontainer">

<!-- member registration page -->

<table width="100%" border="0" bgcolor="#DDD"><tr><td>
<!-- <font color="#FFFFFF"> SHOPPING BUZZ </font> -->
</td></tr></table>

<span style="padding-left:200px">
<div align="center">
<form name="myform" action="registermember.php" method="post">
<h3> REGISTRATION</h3> 
</span>    
<table border="0" width=90%>
<tr>
<td>
<h3><font color=""> With CustomerInSight account,</br> you can get information about latest electronics</br><div align="center"> <font style="font-style:italic;" size="2" face="arial" color="grey">(* fields are mandatory)</font> </div></font> </h3>
<hr width="60%">
<table border="0" width="100%" >
<tr><td width="33%" align="right">First Name<font color="red">*</font> :</td><td width="30%"><input name="user_fname" type="text" /> </td><td width="20%"  id="fnameError" style="color:red;"></td></tr>

<tr><td width="33%" align="right">Last Name<font color="red">*</font> :<td width="30%"><input name="user_lname" type="text" /></td><td width="20%" id="lnameError" style="color:red;"></td></tr>
</table>
<h3><font color=""> <pre>          Select Id and Password</pre></font> </h3> 
<hr width="60%">
<table border="0" width="100%">
<tr><td width="33%" align="right">Email<font color="red">*</font> :</td><td width="30%"><input name="email_id" type="text" /></td><td width="20%" id="email" style="color:red;"></td></tr>
<tr><td width="33%" align="right">&nbsp;</td><td width="30%"><font style="font-style:italic;" size="2" face="arial" color="grey">
 (example : yourname@localhost)</font></td></tr>
<tr><td width="33%" align="right">Password<font color="red">*</font> :</td><td width="30%" ><input name="password" type="password"  /></td> <td width="20%" id="pass" style="color:red;"></td><label id="passError" style="color:red;"></label></tr>
<tr><td width="33%" align="right">&nbsp;</td><td width="30%"><font style="font-style:italic;" size="2" face="arial" color="grey">
 (Password must contain 6 letters)</font></td></tr>
<tr><td width="33%" align="right">Retype Password<font color="red">*</font>:</td><td width="30%"><input name="repass" type="password" /></td><td width="20%" id="repass" style="color:red;"></td></tr>
</table>

<h3><font color=""><pre>          Enter your personal information</pre> </font> </h3> </p>
<hr width="60%">
<table border="0" width="100%">
<tr><td width="33%" align="right">Birth date<font color="red">*</font>:</td>
<td width="45%"><select name="date">
<option name="date" value="1">1
<option name="date" value="2">2
<option name="date" value="3">3
<option name="date" value="4">4
<option name="date" value="5">5
<option name="date" value="6">6
<option name="date" value="7">7
<option name="date" value="8">8
<option name="date" value="9">9
<option name="date" value="10">10
<option name="date" value="11">11
<option name="date" value="12">12
<option name="date" value="13">13
<option name="date" value="14">14
<option name="date" value="15">15
<option name="date" value="16">16
<option name="date" value="17">17
<option name="date" value="18">18
<option name="date" value="19">19
<option name="date" value="20">20
<option name="date" value="21">21
<option name="date" value="22">22
<option name="date" value="23">23
<option name="date" value="24">24
<option name="date" value="25">25
<option name="date" value="26">26
<option name="date" value="27">27
<option name="date" value="28">28
<option name="date" value="29">29
<option name="date" value="30">30
<option name="date" value="31">31
</select>

<select name="month">
<option name="month" value="1">January
<option name="month" value="2">February
<option name="month" value="3">March
<option name="month" value="4">April
<option name="month" value="5">May
<option name="month" value="6">June
<option name="month" value="7">July
<option name="month" value="8">August
<option name="month" value="9">September
<option name="month" value="10">October
<option name="month" value="11">November
<option name="month" value="12">December
</select>


<input name="year" type="text" /></td><td width="20%" id="year" style="color:red;"></td></tr>
<tr><td width="33%" align="right">
Sex<font color="red">*</font>:</td>
<td><input width="45%" name="gender" type="radio" value="Male" checked />Male</td><td width="20%" id="sex" style="color:red;"></td></tr>
<tr><td width="35%">&nbsp;</td><td><input name="gender" type="radio" value="female" />Female</td></tr>
</td></tr></table>
<h3><font color=""> <pre>          Choose your interest product <font style="font-style:italic;" size="2" face="arial" color="grey">(Optional)</font> </pre></font>  </h3> 
<hr width="60%">
<table width="100%" border="0">
<tr><td width="33%" align="right">Interest in:</td>
<td width="30%"><Input type = 'Checkbox' Name ='camera' value ="camera" >

Camera</td> <td width="20%"></td></tr>

<tr><td width="33%">&nbsp;</td><td width="30%"><Input type = 'Checkbox' Name ='television' value="television" >

Television</td></td><td width="20%"></td></tr>

<tr><td width="33%">&nbsp;</td><td width="30%"><Input type = 'Checkbox' Name ='speaker' value="speaker" >

Speaker</td></td><td width="20%"></td></tr>

<tr><td width="33%">&nbsp;</td><td width="30%"><Input type = 'Checkbox' Name ='phone' value="phone" >

Phone</td></td><td width="20%"></td></tr>

</td></tr></table>
<h3><font color=""> <pre>          In Case you forget password </pre></font> </h3> 
<hr width="60%">


<table width="100%" border="0">
<tr><td width="33%" align="right">Security Question<font color="red">*</font>:</td>
<td width="30%"><select name="sec_q">
<option name="sec_q" value="Which place you born?">Which place you born?
<option name="sec_q" value="What is your nick name?">What is your nick name?
</select></td><td width="20%"></td></tr>
<tr><td width="33%" align="right"> Answer<font color="red">*</font>:</td>
<td width="30%"><input name="sec_a" type="text" /></td><td width="20%" id="ans" style="color:red;"></td></tr>

<tr><td width="33%">&nbsp;</td><td width="30%">&nbsp;</td><td width="20%">&nbsp;</td></tr>
<tr><td width="33%">&nbsp;</td><td width="30%"><input name="terms" type="checkbox"/>I accept <a href="terms.html">Terms and Condition</a></td><td width="20%" id="terms" style="color:red;"></td></tr>
<tr><td width="33%">&nbsp;</td><td width="20%"><td></tr>
</table>
<div align="center">
<input name="ok" type="button" value="Create My Account" onclick="showMsg()"/>
</div>
<label id="php"/>

<script type="text/javascript">
function showMsg()
{

	var firstName = document.myform.user_fname.value;
	var lastName = document.myform.user_lname.value;
	var eMail = document.myform.email_id.value;
	var usrname= document.myform.email_id.value;
	var Pass = document.myform.password.value;
	var rePass = document.myform.repass.value;
	var Year = document.myform.year.value;
	var Sex = document.myform.gender.value;
	var Ans = document.myform.sec_a.value;
	var Terms = document.myform.terms.value;
	
	

	var success = 1;

	
	if(firstName == "")
	{
		document.getElementById("fnameError").innerHTML = "Please enter your first name";
		success = 0;
	}
	else
	{
		document.getElementById("fnameError").innerHTML = "";
	}
	//alert("hi");
	
	if(lastName == "")
	{
		document.getElementById("lnameError").innerHTML = "Please enter your last name";
		success = 0;
	}
	else
	{
		document.getElementById("lnameError").innerHTML = "";
	}
	
	if(eMail == "")
	{
		document.getElementById("email").innerHTML = "Please enter your email";
		success = 0;
	}
	else
	{
		document.getElementById("email").innerHTML = "";
	}
	
	if( (usrname.indexOf("@")== -1))
		{
		  //alert("invalid email entry");
		  
		  success = 0;
		}
	
	if(Pass == "")
	{
		document.getElementById("pass").innerHTML = "Please enter your password";
		success = 0;
	}
	else
	{
		document.getElementById("pass").innerHTML = "";
	}
	
	
	if(document.myform.password.value.length<6)
	{
		document.getElementById("passError").innerHTML = "Password must contain atleast 6 character";
		success = 0;
	}
	
	//alert("after pass");
	if(rePass != Pass)
	{
		document.getElementById("repass").innerHTML = "Passwords not identical";
		success = 0;
	}

		

	if(Year == "")
	{
		document.getElementById("year").innerHTML = "Please enter your Birth Year";
		success = 0;
	}
	else
	{
		document.getElementById("year").innerHTML = "";
	}
	
	
	if(Sex == "")
	{
		document.getElementById("sex").innerHTML = "Please enter your Sex";
		success = 0;
	}
	
	if(Ans == "")
	{
		document.getElementById("ans").innerHTML = "Please enter your Answer";
		success = 0;
	}
	else
	{
		document.getElementById("ans").innerHTML = "";
	}
	
	if(Terms == "")
	{
		document.getElementById("terms").innerHTML = "Please accept the tncs";
		success = 0;
	}
	else
	{
		document.getElementById("terms").innerHTML = "";
	}
	
	

	
	if(success == 0)
	{
		return;
	}
	//alert("checking");
	document.myform.submit();
	alert("submitted");
}


</script>
</form>
</td>
</tr>
</table>
</div>
<!-- ending member registration page -->
<!-- <div id='coin-slider'>
	<img src="pic1.png"/>
    <span>
	
  	</span>
	<img src="pic2.png" >
    <span>

	</span>
    <img src="pic3.png" >
    <span>
	
    </span>
    <img src="pic4.png" >
    <span>
	
    </span>
    <img src="pic5.png" >
    <span>
	
    </span>
    <img src="pic6.png" >
    <span>

    </span>
   
</div>-->

</div>
<div id="bottomcontainer">

<!-- <h2> Featured Products </h2>
<div class="fp">
<div id="fpimage"></div>
<div id="fpname"></div>
<div id="fpprice"> </div>
<div id="view">
<center> <input type="submit" name="submit" value="View" class="bt_view" /> </center>
</div>
</div>-->
</div>
</div>
<div class="rightcontainer">
<div id="advertisement">
<div id="adv1">
<p class="quote"> <blockquote> "Whoever said money can't buy happiness simply didn't know where to go Shopping" </blockquote> </p> <p class="author"> - Bo Derek </p>  
</div>
<div id="adv2">
<p class="quote"> <blockquote> "You chose us to know about the better choices" </blockquote> </p> 
</div>
<div id="adv3">
<p class="quote"> <blockquote> "To ease the customer's choosing options depending upon their need" </blockquote> </p> 
</div>
</div>
</div>
</div>

<!--</div> -->

<div class="footer">
<h3> Quick Links </h3>
 
<ul class="footerlinks">
<ul>
<li class="links"><a href="#"> Company Overview </a>  </li>
<li class="links"><a href="#"> Contact Us </a> </li>
<li class="links"><a href="#"> Feedback </a></li> </ul>
<ul>
<li class="links"><a href="#"> Membership Registration </a></li>
<li class="links"><a href="#">  User Login </a></li>
<li class="links"><a href="#"> Admin Login </a></li>
<li class="links"><a href="#"> Vendor Login </a></li>
</ul>
</div>
</div>
</body>
</html>
